import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:gourmet/color/hex.dart';
import 'package:gourmet/extensions/ex_widget.dart';
import 'package:gourmet/utils/colors.dart';
import 'package:gourmet/utils/styles.dart';
import 'package:gourmet/utils/svg.dart';

class InvoiceAssistantController extends GetxController {
  final double navHeight = 44 + Get.mediaQuery.padding.top;

  RxInt checkedIndex = RxInt(0);

  RxBool isSelected = RxBool(false);

  final List<String> checked = ['个人', '小莫', '默认'];
}

class InvoiceAssistantPage extends GetView<InvoiceAssistantController> {
  const InvoiceAssistantPage({super.key});

  @override
  Widget build(BuildContext context) {
    return MediaQuery.removeViewPadding(
      context: context,
      removeBottom: true,
      removeLeft: true,
      removeRight: true,
      removeTop: true,
      child: Scaffold(
        backgroundColor: HexColor(ColorsUtils.colorF7f7),
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(controller.navHeight),
          child: AnnotatedRegion<SystemUiOverlayStyle>(
            value: SystemUiOverlayStyle.dark,
            child: Container(
              color: HexColor(ColorsUtils.colorF7f7),
              height: controller.navHeight,
              padding: Get.mediaQuery.padding,
              child: Stack(
                children: [
                  Positioned(
                    width: 40,
                    height: 44,
                    top: 0,
                    left: 0,
                    child: Center(
                      child: Icon(
                        CupertinoIcons.chevron_back,
                        size: 20,
                        color: HexColor(ColorsUtils.color0000),
                      ),
                    ).onTap(Get.back),
                  ),
                  Center(
                    child: Text(
                      '发票助手',
                      softWrap: true,
                      style: StylesUtils.customTextStyle(
                        fontSize: StylesUtils.fontSize16,
                        fontWeight: FontWeight.w700,
                        color: ColorsUtils.color0000,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
        body: SingleChildScrollView(
          child: Column(
            children: [
              Container(
                height: 60,
                margin: insets,
                padding: const EdgeInsets.symmetric(horizontal: 15),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  color: Colors.white,
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      '开具发票',
                      style: StylesUtils.customTextStyle(
                        color: ColorsUtils.color0000,
                        fontSize: StylesUtils.fontSize15,
                      ),
                    ),
                    Obx(
                      () => GFToggle(
                        onChanged: (bool? val) {
                          controller.isSelected.value = val!;
                        },
                        value: controller.isSelected.value,
                        type: GFToggleType.ios,
                        borderRadius: BorderRadius.circular(12),
                        enabledTrackColor: HexColor(ColorsUtils.colorFf64),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                margin: insets,
                padding: const EdgeInsets.symmetric(horizontal: 15),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(10),
                  color: Colors.white,
                ),
                child: Column(
                  children: [
                    Container(
                      height: 50,
                      alignment: Alignment.centerLeft,
                      child: Text(
                        '发票信息',
                        style: StylesUtils.customTextStyle(
                          fontSize: StylesUtils.fontSize15,
                          color: ColorsUtils.color0000,
                        ),
                      ),
                    ),
                    ...controller.checked
                        .asMap()
                        .map(
                          (key, value) => MapEntry(
                            key,
                            SizedBox(
                              height: 50,
                              child: Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Text.rich(
                                    TextSpan(
                                      children: [
                                        WidgetSpan(
                                          child: Obx(() {
                                            if (controller.checkedIndex.value ==
                                                key) {
                                              return Icon(
                                                CupertinoIcons
                                                    .checkmark_alt_circle_fill,
                                                size: 20,
                                                color: HexColor(
                                                    ColorsUtils.colorFf64),
                                              );
                                            }
                                            return Icon(
                                              CupertinoIcons.circle,
                                              size: 20,
                                              color: HexColor(
                                                  ColorsUtils.colorCccc),
                                            );
                                          }),
                                          alignment:
                                              PlaceholderAlignment.middle,
                                        ),
                                        TextSpan(
                                          text: ' $value',
                                          style: StylesUtils.customTextStyle(
                                            fontSize: StylesUtils.fontSize15,
                                            color: ColorsUtils.color0000,
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                  SvgUtils.assetName('u1909',
                                      width: 18, height: 17),
                                ],
                              ),
                            ).onTap(() {
                              controller.checkedIndex.value = key;
                            }),
                          ),
                        )
                        .values,
                    Divider(
                      height: 30,
                      color: HexColor(ColorsUtils.colorF5f5),
                      indent: 3,
                      endIndent: 3,
                      thickness: 2,
                    ),
                    Container(
                      alignment: Alignment.center,
                      padding: const EdgeInsets.only(bottom: 20, top: 10),
                      child: Text(
                        '✚ 新增抬头',
                        softWrap: true,
                        style: StylesUtils.customTextStyle(
                          fontSize: StylesUtils.fontSize16,
                          color: ColorsUtils.colorFf64,
                        ),
                      ),
                    ),
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  EdgeInsets get insets {
    return EdgeInsets.only(
        left: (Get.width - 345) / 2, right: (Get.width - 345) / 2, top: 10);
  }
}
